<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>corner</title>
    <link rel="stylesheet" href="../../model/element.css">
</head>
<body>
<!--目录-->
<div class="catalog">
    <h2>目录</h2>
    <ul>
        <li>
            <p><a href="#element">< corner ></a></p>
        </li>
        <li>
            <p><a href="#attribute">属性</a></p>
            <ul>
                <li><p><a href="#example">实例</a></p></li>
                <li><p><a href="#optional">可选属性</a></p></li>
                <li><p><a href="#note">提示和注释</a></p></li>
                <li><p><a href="#sketch">效果图</a></p></li>
            </ul>
        </li>
    </ul>
</div>
<!--标签-->
<div id="element">
    <h2>corner</h2>
    <div>简介:</div>
    <p>图片的角标</p>
</div>
<!--属性-->
<div id="attribute">
    <h2>属性</h2>
    <div style="margin-left: 25px" id="example">
        <h3>实例:</h3>
        <xmp>
            <img src="" >
                <corner position="1" font="10,#232323" size="30" background="#ff0000">5</corner>
            </img>
        </xmp>
    </div>
    <div id="optional">
        <h3>可选属性:</h3>
        <table >
            <tbody>
            <tr>
                <th>属性</th>
                <th>值</th>
                <th>描述</th>
            </tr>
            <tr>
                <td>font</td>
                <td>int,color|color,int</td>
                <td>角标文字的大小和颜色</td>
            </tr>
            <tr>
                <td>position</td>
                <td>int</td>
                <td>角标所处的象限位置,共1234象限</td>
            </tr>
            <tr>
                <td>background</td>
                <td>color</td>
                <td>角标的背景色</td>
            </tr>
            <tr>
                <td>size</td>
                <td>int</td>
                <td>角标半径</td>
            </tr>
            <tr>
                <td>val</td>
                <td>script</td>
                <td>角标的值,若为"",则不显示角标,若为"point",则暂时小圆点,若为string,则展示string</td>
            </tr>

            </tbody>
        </table>
    </div>
    <div id="note">
        <h3>提示和注释:</h3>
        <p>角标的大小不会随着文字长度改变,</p>
    </div>
    <div id="sketch">
        <h3>效果图:</h3>
        <img src="img/shequ_03.png" alt="">
    </div>
</div>
<div class="author">
    <p>by-草草</p>
</div>
</body>
</html>